<template>
	<view>
		<view class="item">
			<view class="flex-between" style="margin-bottom: 28upx;">
				<view class="flex-align">
					<round-node size="20rpx" background="var(--theme-color)"></round-node>
					<view class="item-time">2020.02.30 10:34</view>
				</view>
				<view class="item-price">121元</view>
			</view>
			<view>
				<view class="flex-align">
					<round-node size="10rpx" background="#333333"></round-node>
					<view class="item-text ellipsis">成都金牛万达广场</view>
				</view>
				<view class="flex-between">
					<view class="flex-align" style="margin-top: 10upx;">
						<round-node size="10rpx" background="var(--theme-color)"></round-node>
						<view class="item-text ellipsis">春熙路-地铁站-西南侧(春熙路)</view>
					</view>
					<button class="item-button clear-button buttonCenter" @click="goTo('/pages/'+goToUrl+'/index?status='+status)">{{buttonText}}</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		props:{
			buttonText:{
				type:String,
				default:'去接单'
			},
			goToUrl:{
				type:String,
				default:'confirm'
			},
			status:{
				type:String,
				default:'0'
			},
		}
	}
</script>

<style lang="scss" scoped>
	.item{
		width: 618upx;
		background: #FFFFFF;
		border-radius: 10Upx;
		margin: 40upx auto;
		padding: 34upx;
		font-size: 28upx;
		font-weight: bold;
		color: #333333;
		.item-time{
			margin-left: 10upx;
			font-size: 28upx;
			font-weight: bold;
			color: #333333;
		}
		.item-text{
			margin-left: 10upx;	
			font-size: 24upx;
			font-weight: bold;
			color: #333333;
			width: 312upx;
		}
		.item-price{
			font-size: 32upx;
			font-weight: bold;
			color: #333333;
		}
		.item-button{
			width: 132upx;
			height: 52upx;
			background: var(--theme-color);
			border-radius: 10upx;
			font-size: 24upx;
			font-weight: bold;
			color: #FFFFFF;
		}
	}
</style>
